<!DOCTYPE html>
<html lang="en">
<head>
  <title>Test page :: Transparent and other Elements with non-standard visibility</title>
  <meta charset="UTF-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <style>
    #no-size-link:before {
      content: "I am the no size link!";
    }
  </style>
</head>
<body>
  <div>
    Link is transparent:<a id="inv-link" href="#" style="opacity: 0">Invisible but clickable element</a>
  </div>
  <div>
    Link is almost transparent:<a id="link" href="#" style="opacity: 0.01">Visible and clickable element</a>
  </div>
  <div>
    <label for="inv-input">Input is transparent:</label>
    <input id="inv-input" type="text" style="opacity: 0"></input>
  </div>
  <div>
    <label for="input">Input is almost transparent:</label>
    <input id="input" type="text" style="opacity: 0.01"></input>
  </div>
  <div>
    Link with no size - Link:<a id="no-size-link" href="#"></a>
  </div>
</body>
</html>
